<template>
	<div class="notifier flex a-center">
		<div class="icon"></div>
		<div class="text">
			<div class="swiper notifierSwiper">
				<!-- <div class="swiper-wrapper">
					<div class="swiper-slide">恭喜某某宝贝领取积分2000积分，恭喜某111</div>
					<div class="swiper-slide">恭喜某某宝贝领取积分2000积分，恭喜某222</div>
					<div class="swiper-slide">恭喜某某宝贝领取积分2000积分，恭喜某33</div>
				</div> -->

				<swiper class="swiper swiper-wrapper" circular :indicator-dots="false" :autoplay="autoplay" :interval="interval"
				:duration="duration">
					<swiper-item v-for="item in 3">
						<view class="swiper-item uni-bg-red swiper-slide">
							恭喜某某宝贝领取积分2000积分，恭喜某111
						</view>
					</swiper-item>
				</swiper>


			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				autoplay: true,
				interval: 2000,
				duration: 500,
				newsList: [],
				static_uri: getApp().globalData.glb_list.config.static_uri, // 获取全局配置文件
				glbId: getApp().globalData.glb_list.glbId, // 获取全局的id
			}
		},
		mounted() {
			// var swiper = new Swiper(".notifierSwiper", {
			// 	loop:true,
			// 	direction: "vertical",
			// 	autoplay: {
			// 		delay: 3000, //3秒切换一次
			// 	},
			// 	pagination: {
			// 		clickable: true,
			// 	},
			// });
		}
	}
</script>

<style scoped lang="scss">
	.notifier {
		width: 100%;
		height: 0.52rem;
		background-color: #FFF9F0;
		border-radius: 0.26rem;
		color: #FD4933;
		margin-top: 0.15rem;
		padding: 0 0.2rem;

		.icon {
			width: 0.52rem;
			height: 0.52rem;
			background: url('../../assets/img/laba.png');
			background-size: 100% 100%;
		}

		.text {
			font-size: 0.24rem;
			margin-left: 0.1rem;
			flex: 1;
			height: 0.52rem;
			overflow: hidden;
		}
	}

	.swiper {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	.swiper-slide{line-height: 0.52rem;}
</style>